<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<link rel="stylesheet" href="lib/lib/css/bootstrap.min.css">
<style type="text/css">

</style>
</head>
<body>


<div class="container">
	<div class="alert alert-info fade in" id="myalert">
		<button type="button" class="close" data-dismiss="alert">
			&times;
		</button>
		<strong>极客学院</strong>
	</div>

	<div class="alert alert-info fade in" id="myalert1">
		<button type="button" class="close" data-dismiss="alert">
			&times;
		</button>
		<strong>极客学院1111</strong>


		<button class="btn btn-success " data-toggle="modal" data-target="#mymodal">详情</button>	

		<div id="mymodal" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelladby="myLargeModalLabel" aria-hidden="true">
			<div class="modal-dialog modal-sm">
				<div class="modal-content">
					<h3>这个是小的modal</h3>
				</div>
			</div>
		</div>
	</div>

</div>




<div class="container">

	<button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal2">启动模态框</button>
	
	<div class="modal fade" id="modal2" tabindex="-1" aria-labelladby="myLargeModalLabel" aria-hidden="true" style="margin-top:100px;">
		<div class="modal-dialog modal-md">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button " class="close" data-dismiss="modal"  aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title" >这个是 .modal-header》.modal-title</h4>
			</div>
			<div class="modal-body">
					<h2>h2h2h2h2hh2h2h2h</h2>
			</div>

			<div class="modal-footer">
				<a href="www.baidu.com" class="btn btn-success">跳转百度</a>

				<button type="button " class=" btn btn-primary" data-dismiss="modal"  aria-label="Close">关闭模态框</button>

			</div>
		</div>
	</div>



</div>




<script src="lib/jquery/jquery-1.11.0.min.js"></script>
<script src="lib/lib/js/bootstrap.min.js"></script>
<script type="text/javascript">



</script>

</body>
</html>